import React from 'react';
import Svg, { ClipPath, Defs, G, Path, Rect } from 'react-native-svg';

export const InfoIcon = (): JSX.Element => {
  return (
    <Svg width="100%" height="100%" viewBox="0 0 21 28" fill="none">
      <G clipPath="url(#clip0_2165_87542)">
        <Path
          d="M10.6777 23.9561C16.1758 23.9561 20.6387 19.4932 20.6387 13.9951C20.6387 8.49707 16.1758 4.03418 10.6777 4.03418C5.17969 4.03418 0.716797 8.49707 0.716797 13.9951C0.716797 19.4932 5.17969 23.9561 10.6777 23.9561ZM10.6777 22.2959C6.08789 22.2959 2.37696 18.585 2.37696 13.9951C2.37696 9.40527 6.08789 5.69434 10.6777 5.69434C15.2676 5.69434 18.9785 9.40527 18.9785 13.9951C18.9785 18.585 15.2676 22.2959 10.6777 22.2959Z"
          fill="#8D8D8D"
        />
        <Path
          d="M8.96875 19.4639H12.9434C13.3438 19.4639 13.6563 19.1709 13.6563 18.7705C13.6563 18.3897 13.3438 18.0869 12.9434 18.0869H11.7324V13.1162C11.7324 12.5889 11.4688 12.2373 10.9707 12.2373H9.13477C8.73438 12.2373 8.42188 12.54 8.42188 12.9209C8.42188 13.3213 8.73438 13.6143 9.13477 13.6143H10.1797V18.0869H8.96875C8.56836 18.0869 8.25586 18.3897 8.25586 18.7705C8.25586 19.1709 8.56836 19.4639 8.96875 19.4639ZM10.5898 10.6162C11.3027 10.6162 11.8594 10.0498 11.8594 9.33691C11.8594 8.62402 11.3027 8.05762 10.5898 8.05762C9.88672 8.05762 9.32032 8.62402 9.32032 9.33691C9.32032 10.0498 9.88672 10.6162 10.5898 10.6162Z"
          fill="#8D8D8D"
        />
      </G>
      <Defs>
        <ClipPath id="clip0_2165_87542">
          <Rect
            width="20.2832"
            height="19.9316"
            fill="white"
            transform="translate(0.716797 4.03418)"
          />
        </ClipPath>
      </Defs>
    </Svg>
  );
};
